<template>
  <div>
<!--    卡片-->
    <el-card  style="width: 50%;height: 800px;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);border-radius: 20px;">
      <el-form  ref="form" :model="form" :rules="rules">
        <el-form-item label="补录内容" prop="processStreamContent">
          <el-input :disabled="disabled"   type="textarea" :rows="24" v-model="form.processStreamContent" resize="none"
                    placeholder="请输入内容"></el-input>
        </el-form-item>
        <el-form-item>
          <div style="text-align: right">
            <el-button :disabled="disabled"  type="primary" @click.prevent.native="submitForm" >提 交</el-button>
            <el-button :disabled="disabled" type="primary" plain  @click.prevent.native="reset" >取 消</el-button>
          </div>
        </el-form-item>
      </el-form>
    </el-card>

  </div>
</template>

<script>
import { addFlow } from "@/api/module/shao/shijian/flow";
import {delFlow} from "@/api/project/flow";
export default {
  name: "Bulu",
  props: ['disabled'],
  data() {
    return {
      flowList:[],
      // 查询参数
      queryParams: {
        reportEventId: null,
      },
      // 表单参数
      form: {
        reportEventId:null,
        processStreamContent:null,
      },
      // 表单校验
      rules: {
        processStreamContent:[{
          required: true, message: "补录事件内容不能为空", trigger: "blur"
        },
          {min: 1, max: 900, message: '补录事件内容不能超过 900 个字符', trigger: 'blur'}
        ]
      }
    };
  },
  created() {
    this.form.reportEventId=this.$route.query.id;
  },
  methods: {
    //清空表单
    reset(){
      this.form.processStreamContent=null;
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          this.$modal.confirm('补录后信息将无法修改,请确认补录信息无误，补录成功后请到事件追踪查看相关补录信息！').then(() => {

            // 保存组件实例的引用
            var self = this;
            // 在箭头函数中，this指向组件实例
            addFlow(this.form).then(response => {
              self.reset(); // 使用保存的组件实例引用
              //self.$modal.msgSuccess("");
            });
          }).then(() => {
            this.$modal.msgSuccess("补录成功");
          }).catch(() => {});
        }
      });
    },

    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },

    /** 导出按钮操作 */
    handleExport() {
      this.download('project/report/export', {
        ...this.queryParams
      }, `report_${new Date().getTime()}.xlsx`)
    }
  }
};
</script>
